<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="renderer" content="webkit">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  <title>Document</title>
  <link rel="stylesheet" href="../../css/assets/usdt.css">
  <link rel="stylesheet" href="../../css/public/base.css">
  <link rel="stylesheet" href="../../css/public/nav_two.css">
  <link rel="stylesheet" href="../../layui/css/layui.css" media="all">
  <script src="../../js/public/jquery-3.3.1.js"></script>
</head>
<style>
  #hide{
        height:350px!important;
    }
</style>
<style>
  .nav_two .left>ul>li:nth-of-type(3) {
        background-color: #e5f1fc;
    }

</style>

<body>
  <!-- 删除操作按钮弹框 -->
  <div>
    <div class="tanchu2">
      <div class="cen2">
        <div class="cenTitle">
          <div class="cenLeft">信息</div>
          <div class="cenRight"><i class="layui-icon layui-icon-close" style="font-size: 20px;font-weight: bold; color: #666;"></i></div>
        </div>
        <div class="cenContent">确认要删除？</div>
        <div class="cenBotton">
          <button class="layui-btn cenBtn btnOne" lay-submit="" lay-filter="demo1">提交</button>
          <button class="layui-btn cenBtn btnTwo" lay-submit="" lay-filter="demo1">提交</button>
        </div>
      </div>
    </div>
  </div>
  <!-- 查看操作按钮弹框 -->
  <div class="lookcont">
    <div class="inline">
      <span>时间</span>
      <p>2018-01-04 12:00:00</p>
    </div>
    <div class="inline">
      <span>USDT地址</span>
      <p>123456789</p>
    </div>
    <div class="inline">
      <span>排序</span>
      <p>01</p>
    </div>
  </div>

  <div id="nav"></div>
  <div class="priceManagement">
    <form class="layui-form" action="">
      <div class="main">
        <div class="left">
          <div class='nav_two'>
            <div class="left">
              <ul>
                <li><div><span class="circle"></span><a href="../Assets/statistics.html"></a>资产统计</div></li>
                <li><div><span class="circle"></span><a href="../Assets/getMoney.html"></a>收款卡号管理</div></li>
                <li><div><span class="circle"></span><a href="../Assets/usdt.html"></a>USDT地址</div></li>
                <li><div><span class="circle"></span><a href="../Assets/System.html"></a>系统拨比</div></li>
                <li><div><span class="circle"></span><a href="../Assets/statistics_xi.html"></a>资金明细</div></li>
              </ul>
            </div>
          </div>
        </div>
        <!-- 添加地址弹框 -->
        <div id="hide">
          <div class="hideContent layui-form">
            <div class="layui-form-item">
              <label class="layui-form-label">USDT地址</label>
              <div class="layui-input-block">
                <input type="text" name="title" required placeholder="请输入" autocomplete="off" class="layui-input">
              </div>
            </div>
            <div class="layui-form-item">
              <label class="layui-form-label" style="margin-left:-128px;">是否展示</label>
              <div class="layui-input-block">
                <input type="checkbox" name="switch" lay-skin="switch" lay-text='开|关'>
              </div>
            </div>
            <div class="layui-form-item">
              <label class="layui-form-label">排序</label>
              <div class="layui-input-block">
                <input type="text" name="sort" placeholder="请输入" autocomplete="off" class="layui-input">
              </div>
            </div>
          </div>
        </div>
        <div class="right">
          <div class="middle">
            <div class="site-demo-button" id="layerDemo" style="margin-bottom: 0;">
              <button class="addManage" data-type="auto">添加地址</button>
            </div>
          </div>
          <!-- 操作按钮 -->
          <div class="button">
            <table class="layui-hide" id="demo" lay-filter="test"></table>
            <script type="text/html" id="barDemo">
              <a style="color:#2d528f" class="layui-btn layui-btn-primary layui-btn-xs" lay-event="look">查看</a>
              <a style="color: #ff0000" class="layui-btn layui-btn-primary layui-btn-xs" lay-event="del">删除</a>
            </script>
            <script type="text/html" id="openIf">
              <input class="openclose" type="checkbox" name="close" lay-skin="switch" lay-text="开|关">
            </script>
          </div>
        </div>
      </div>
    </form>
  </div>
  <script src="../../layui/layui.js"></script>
  <script src='../../js/assets/assets.js'></script>
  <script>
    layui.use('element', function () {
      var element = layui.element; //导航的hover效果、二级菜单等功能，需要依赖element模块

      //监听导航点击
      element.on('nav(demo)', function (elem) {
        layer.msg(elem.text());
      });
    });
  </script>
  <script>
    layui.use(['table', 'form', 'laypage', 'layer'], function () {
      var table = layui.table,
        laypage = layui.laypage,
        layer = layui.layer

      $('.addManage').click(function () {
        layer.open({
          type: 1,
          title: '新增USDT地址',
          closeBtn: 1,
          area: '710px;',
          shade: 0,
          id: 'LAY_layuipro', //设定一个id，防止重复弹出
          btn: ['提交', '重置'],
          btnAlign: 'c',
          moveType: 1, //拖拽模式，0或者1
          content: $('#hide'),
          success: function (layero) {
            var btn = layero.find('.layui-layer-btn');
            btn.find('.layui-layer-btn0').attr({
              href: '#',
              // target: '_blank'
            });
          }
        });
      })

      table.render({
        elem: '#demo',
        skin: 'nob',
        page: true,
        limit: 17,
        cols: [
          [{
            type: 'checkbox',
            minWidth: 80
          }, {
            field: 'time',
            title: '时间',
            minWidth: 150,
            unresize: true
          }, {
            field: 'address',
            title: 'USDT收款地址',
            minWidth: 200,
            unresize: true
          }, {
            field: 'userif',
            title: '是否启用',
            toolbar: '#openIf',
            minWidth: 150,
            unresize: true
          }, {
            field: 'order',
            title: '排序',
            minWidth: 80,
            unresize: true
          }, {
            title: '操作',
            minWidth: 100,
            align: 'center',
            toolbar: '#barDemo',
            unresize: true,
            fixed: 'right'
          }]
        ],
        data: [{
          "time": "2018-01-04 12:00:00",
          "address": "123456789",
          "userif": "开关",
          "type": "checkbox",
          "order": '01'
        }, {
          "time": "2018-01-04 12:00:00",
          "address": "123456789",
          "userif": "开关",
          "type": "checkbox",
          "order": '01'
        }, {
          "time": "2018-01-04 12:00:00",
          "address": "123456789",
          "userif": "开关",
          "type": "checkbox",
          "order": '01'
        }]
      });

      table.on('tool(test)', function (obj) { //注：tool 是工具条事件名，test 是 table 原始容器的属性 lay-filter="对应的值"
        var data = obj.data //获得当前行数据
          ,
          layEvent = obj.event; //获得 lay-event 对应的值
        if (layEvent === 'look') {
          layer.open({
            type: 1,
            title: '查看',
            closeBtn: 1,
            area: '700px;',
            shade: 0,
            move: false,
            id: 'LAY_layuipro', //设定一个id，防止重复弹出
            btn: ['确定', '取消'],
            btnAlign: 'c',
            moveType: 1, //拖拽模式，0或者1
            content: $('.lookcont'),
            success: function () {

            }
          });
        } else if (layEvent === 'del') {
          layer.open({
            type: 0,
            id: 'turnDown' //防止重复弹出
              ,
            area: ['400px !important', '220px !important'],
            title: "信息",
            content: '<p style="font-size: 16px;height: 40px;line-height: 40px">确认删除吗?</p>',
            btn: ['确定', '取消'],
            btnAlign: 'r' //按钮对齐方式
              ,
            shade: 0,
            shadeClose: true,
            move: false,
            resize: false,
            yes: function () {
              layer.closeAll();
              layer.msg("删除成功")
            },
            btn2: function () {
              layer.closeAll();
            }
          });
        }
      });

      laypage.render({
        elem: 'demo3',
        prev: '<em><</em>',
        next: '<em>></em>',
        count: 100,
        layout: ['limit', 'skip', 'prev', 'page', 'next'],
        jump: function (obj) {
          console.log(obj)
        }
      });
    });

    $('#layerDemo .layui-btn').on('click', function () {
      var othis = $(this),
        method = othis.data('method');
      active[method] ? active[method].call(this, othis) : '';
    });
  </script>
</body>

</html>